{% extends 'admin/public/base.html' %}


{% block title %}
<title>用户管理--添加</title>
{% endblock %}

{% block script %}
<script src="/static/admin/js/uploadPreview.js"></script>
{% endblock %}

{% block con %}            
<div class="container-fluid am-cf">
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-9">
            <div class="page-header-heading">
                <span class="am-icon-home page-header-heading-icon"></span> 用户添加 
            </div>
        </div>
       
    </div>
</div>

<div class="row-content am-cf">
    <div class="row  am-cf">
        
        <div class="row">
            <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                <div class="widget am-cf">
                    
                    <div class="widget-body am-fr">

                        <form class="am-form tpl-form-line-form" action="{% url 'myadmin_user_insert' %}" method="POST" enctype="multipart/form-data" >
                            {% csrf_token %}
                            <!-- 用户名 -->
                            <div class="am-form-group">
                                <label for="user-name" class="am-u-sm-3 am-form-label">用户名</label>
                                <div class="am-u-sm-9">
                                    <input type="text" class="tpl-form-input" required  maxlength="30" name="username" id="user-name" >
                                    <small>请填写标题文字6-30字左右。</small>
                                </div>
                            </div>
                            <!-- 密码 -->
                            <div class="am-form-group">
                                <label for="user-name" class="am-u-sm-3 am-form-label">密码 
                                </label>
                                <div class="am-u-sm-9">
                                    <input type="text" name="password" required minlength="6" maxlength="30" class="tpl-form-input" id="user-name" >
                                    <small>请填写密码6-30字左右。</small>
                                </div>
                            </div>
                            <!-- 手机号 -->
                            <div class="am-form-group">
                                <label for="user-name" class="am-u-sm-3 am-form-label">手机号 
                                </label>
                                <div class="am-u-sm-9">
                                    <input type="text" name="phone" class="tpl-form-input" required minlength="11" maxlength="11" id="user-name" >
                                    <small>请填写手机号。</small>
                                </div>
                            </div>
                           <!-- 邮箱 -->
                           <div class="am-form-group">
                                <label for="user-name" class="am-u-sm-3 am-form-label">邮箱 
                                </label>
                                <div class="am-u-sm-9">
                                    <input type="text" name="email" class="tpl-form-input" required id="user-name" >
                                    <small>请填写邮箱。</small>
                                </div>
                            </div>
                            <!-- 年龄 -->
                            <div class="am-form-group">
                                <label for="user-name" class="am-u-sm-3 am-form-label">年龄 
                                </label>
                                <div class="am-u-sm-9">
                                    <input type="Number" name="age" class="tpl-form-input" id="user-name" >
                                    <small>请填写年龄。</small>
                                </div>
                            </div>
                            <!-- 性别 -->
                            <div class="am-form-group">
                                <label for="user-name" class="am-u-sm-3 am-form-label">性别 
                                </label>

                                <label class="am-radio-inline">
                                    <input type="radio" value="1" name="sex"> 男
                                </label>
                                <label class="am-radio-inline">
                                    <input type="radio" value="0" name="sex"> 女
                                </label>
                            </div>

                            <!-- 上传头像 -->
                            <div class="am-form-group">
                                <label for="user-weibo" class="am-u-sm-3 am-form-label">
                                    上传头像
                                </label>
                                <div class="am-u-sm-9">
                                    <div class="am-form-group am-form-file"> 
                                        <ul id="warp">
                                            <li>                                                
                                                <div class="tpl-form-file-img">
                                                    <img id="imgShow_WU_FILE_0" width="100" height="100" src="/static/pics/user.jpg">
                                                    
                                                    <input name="pic" type="file" id="up_img_WU_FILE_0">
                                                </div>
                                                <i class="am-icon-cloud-upload" ></i> 上传头像
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>  

                            <!-- 提交 -->
                            <div class="am-form-group">
                                <div class="am-u-sm-9 am-u-sm-push-3">
                                    <button class="am-btn am-btn-primary tpl-btn-bg-color-success ">提交</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>


    </div>
</div>
{% endblock %}      
